
<%@ include file="/view/template/header.jsp"%>	
	<div id="content">
    	<%@ include file="/view/ehr/ehr_common.jsp"%>
		<script>
			$(function() {
				$("#tabs").tabs();
			});

		</script>
		<div class="right-content">
			<s:form method="post">
			 <div class="box">
				<h1>More Patient Details</h1>
<s:if test="action.patientDetailsList.size > 0">

<s:iterator value="action.patientDetailsList">
				<div id="tabs">
					<ul>
						<li><a href="#tabs-1">Personal Details</a>
						</li>
						<li><a href="#tabs-2">Contact Details</a>
						</li>
						
					</ul>
					<div id="tabs-1">
					  <div class="sub_box">
					  <div class="con-part">
							<span>
								<s:label key="label.patient.prefix" cssClass="label_text"></s:label>
							</span>
							
							<s:select name="patient.prefix"
								list="prefixList"
								headerKey="0" headerValue="---Select Prefix---"
								
								class="select_box">
								</s:select>
							
							</div>
							<div class="con-part">
							<span>
								<s:label key="label.patient.patientId" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="patient.patientId" class="input-text"></s:textfield> 
						</div>
						<div class="con-part">
							<span>
								<s:label key="label.patient.givenName" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="patient.givenName" class="input-text"></s:textfield> 
						</div>
						<div class="con-part">
							<span>
								<s:label key="label.patient.familyName" cssClass="label_text"></s:label> 
							</span>
							<s:textfield name="patient.familyName" class="input-text"></s:textfield>
						</div>
						 
						<div class="con-part">
							<span>
								<s:label key="label.patient.gender" cssClass="label_text"></s:label>
							</span> 
							<s:radio name="patient.gender"  list="genderList" cssClass="input-radio"/>
						</div>
						
 						 <div class="con-part">
 						 	<span>
 						 		<s:label key="label.patient.dob" cssClass="label_text"></s:label>
 						 	</span>
							<sj:datepicker key="patientDetails.patient.birthTime"/>
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.patient.nic" cssClass="label_text"></s:label>
							</span>
							<s:textfield name="patient.nicNo" class="input-text"></s:textfield>
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.patient.birthPlace" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="patient.birthPlaceAddress" class="input-text"></s:textfield> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.patient.maritialStatus" cssClass="label_text"></s:label>
							</span> 
							<s:radio name="patient.maritialStatus" list="maritialStatusList" cssClass="input-radio"/> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.patient.religion" cssClass="label_text"></s:label>
							</span>
							
							 <s:select name="patient.religiousAffliationId"
								list="religionList"	
								headerKey="0"				
								headerValue="--Select relogion--"
								listKey="religiousAffliationId"
								listValue="description"
								class="select_box">
							</s:select> 
							
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.patient.ethnicGroup" cssClass="label_text"></s:label>
							</span>
							<s:select name="patient.ethnicGroupId"
								list="ethnicGroupList"
								headerKey="0"
								headerValue="--Select Ethnic Group--" 
								listValue="description"
								listKey="ethnicGroupId"
								class="select_box">
							</s:select> 
						</div>
					</div>
					</div>
					<div id="tabs-2">
					<div class="sub_box">
						<h2>Address</h2>
						<div class="con-part">
							<span>
								<s:label key="label.address.houseNo" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="patientAddressList.houseNumber" class="input-text"></s:textfield> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.address.streetName" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="patientAddressList.street" class="input-text"></s:textfield> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.address.city1" cssClass="label_text"></s:label>
							</span>
							<s:textfield name="patientAddressList.city1" class="input-text"></s:textfield> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.address.city2" cssClass="label_text"></s:label>
							</span>
							<s:textfield name="patientAddressList.city2" class="input-text"></s:textfield> 
						</div> 
						
						<div class="con-part">
							<span>
								<s:label key="label.address.country" cssClass="label_text"></s:label>
							</span>
							<s:select name="patientAddressList.country"
								list="countryList"
								headerKey="0" headerValue="---Select Country---"
								
								class="select_box">
							</s:select>
							
						</div>
						
						
						<div class="con-part"></div>
						<div class="add_email">
						<s:if test="patientEmailList.size > 0">

<s:iterator value="patientEmailList">
						<div class="con-part">
							<span>
								<s:label key="label.patient.email" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="email" class="input-text"></s:textfield> 
							<a href="javascript:void(0);"> <span class="remove_email">Remove</span></a>
						</div>
						</s:iterator>
						</s:if>
						</div>
						
						
						<!-- <div class="con-part"><span>&nbsp;</span> <a href="javascript:void(0);"
							 id="addemail" class="green">Add more</a> </div> -->
							
						<div class="con-part"></div>
						<s:if test="patientTelephoneList.size > 0">

<s:iterator value="patientTelephoneList">
						<div class="con-part">
							<span>
								<s:label key="label.patient.telephone" cssClass="label_text"></s:label>
							</span> 
							<s:textfield name="telephoneNo" class="input-text"></s:textfield> 
						</div>
						 </s:iterator>
						 </s:if>
						<!-- <div class="con-part">
							<span>&nbsp;</span> 
						<a href="javascript:void(0);" class="green">Add more</a> </div>
					</div> -->
					</div>	
				</div>
				</s:iterator>
				</s:if>
				<div class="button_bar2">
				<s:url action="view_ward" var="view_ward_action">
				<s:param name="patient_id" value="patient.patientId"/>
				</s:url>
				<a href="${view_ward_action}" class="green"><s:text name="label.admitPatient"/></a>						
				
				<s:url action="update_patient" var="update_patient_action">
					<s:param name="patient_id" value="patient.patientId"/>
				</s:url>
				<a href="${update_patient_action}" class="green"><s:text name="label.updatePatient"/></a>
					
				<s:url action="back_to_search_results" var="back_to_search_results_action">
					
				</s:url>
				<a href="${back_to_search_results_action}" class="green"><s:text name="label.back"/></a>
				
				</div>
</div>
			</s:form>
		</div>
	</div>

	<%@ include file="/view/template/footer.jsp"%>
	
	 <script type = "text/javascript">
       $(function(){
             //create a new field then append it before the add field button
             $("#addemail").click(function(){
                   var new_field = '<div class="con-part"><span><s:label key="patient.email" cssClass="label_text"></s:label></span> <s:textfield name="patientDetails.patientEmailList.email" class="input-text"></s:textfield><a href="javascript:void(0);"> <span class="remove_email">Remove</span></a></div>';
                  $('#add_email').append(new_field);
            });
       });
        
         $(function(){
             //create a new field then append it before the add field button
             $(".remove_email").live("click", function(event){
                 //alert('Remove Email');
                 $(this).parent().parent().remove();
            });
       });
                    
</script>
